var PreviewImg = function () {
  var template = /* html */ `
    <div class="preview-img">
      <div class="preview-img-content">
        <img :src="formatImgUrl(img)">
      </div>
      <div style="margin-top:10px">
        <el-button type="danger" size="medium" @click="close">关闭</el-button>
        <el-button v-if="order!==null" type="primary" size="medium" @click="updateOrderImg">更新订单图片</el-button>
      </div>

      <update-order-img v-if="toUpdate" :order-id="order.orderId" @update-success="updateImgSuccess" @update-error="toUpdate=false">
      </update-order-img>
    </div>
  `;

  return {
    props: {
      img: {
        type: String,
        required: true
      },
      order: {
        type: Object,
        defualt: null
      }
    },

    data: function () {
      return {
        toUpdate:false
      };
    },

    methods: {
      close: function () {
        this.$emit('close');
      },

      updateOrderImg: function () {
        this.toUpdate = true;
      },

      updateImgSuccess:function(url){
        this.toUpdate = false;
        this.img = url;
        this.order.previewImg = url;
      }
    },

    components: {
      UpdateOrderImg: UpdateOrderImg
    },

    template: template
  };
}();